﻿@{
     Layout = "~/Views/Shared/_Layout.cshtml";
    ViewBag.BodyClass = "easyui-layout";
}



<link rel="stylesheet" type="text/css" href="~/admin/uploader/css/webuploader.css">
<link rel="stylesheet" type="text/css" href="~/admin/uploader/css/style.css">
<style>
    .demo {
        min-width: 360px;
        margin: 30px auto;
        padding: 10px 20px;
    }

        .demo h3 {
            line-height: 40px;
            font-weight: bold;
        }

    .file-item {
        float: left;
        position: relative;
        width: 110px;
        height: 110px;
        margin: 0 20px 20px 0;
        padding: 4px;
    }

        .file-item .info {
            overflow: hidden;
        }

    .uploader-list {
        width: 100%;
        overflow: hidden;
    }
            .fl {
            float: left;
        }

        #imgList > div {
            width: 28%;
            margin: 1% 0 1% 2% !important;
            padding: 10px;
            border: 1px solid #d1d1d1;
            text-align: center;
        }

            #imgList > div img {
                margin: 0 auto;
                width: 125px;
                height: 125px;
            }

        #tbodySkuGroupList tr td, #tbodySkuList tr td {
            border-width: 1px;
            border-style: solid;
            border-color: #777777;
        }
</style>
<body>
    <div class="easyui-panel" style="padding:5px;overflow:auto;overflow-y:auto;">
        <table class="gou-formTable" style="width:100%;height:100%;">
            <tbody>
                <tr>
                    <td colspan="4">
                        <a class="a1 blue"  href="/Material/index">返回</a> </br>
                        
                        <a class="a1 blue"  target="_blank" href="~/Template/批量导入物料Excel模板.xls">批量导入物料Excel模板</a>   </br>    
                    
                    <font color="red">
                        1.下载”批量导入物料Excel模板“</br>
                        2.填充要导入的数据</br>
                        3.点击选择文件，然后导入数据
                        注意：导单上传Excel文件必须是EXCEL 2016或更新版本Excel文件。
                        </font>
                    </td>
                </tr>
                <tr><td colspan="4">
                @using (@Html.BeginForm("Material", "ImportMaterial", FormMethod.Post, new { enctype = "multipart/form-data" }))
                {

                    <input name="file" type="file" style="display: none;" id="file" class="button inlineBtn noindent h32" style="display: inline-block; width: 300px" />
                    <input type="button" class="button inlineBtn noindent h32" name="Upload" id="Upload" value="选择文件" />
                  <input type="button" class="button inlineBtn noindent h32" name="submitBtn" id="submitBtn" value="批量导入" />
                   <span id="operateMsg"></span>
                }</td></tr>
            </tbody>
        </table>

    </div>

    <table id="tbMaterialList" data-options="region:'center',border:false" class="easyui-datagrid"
           @*toolbar="#tb" pagination="true"
           rownumbers="true" fitcolumns="true" singleselect="true" fit="true"*@>
        <thead>
            <tr>
                <th data-options="field:'MaterialName',align:'left'" width="25%">物料名</th>
                <th data-options="field:'CatagoryName',align:'center'" width="25%">分类</th>
                <th data-options="field:'SingleWeight',align:'center'" width="25%">净重</th>
            </tr>
        </thead>
    </table>


@*<script type="text/javascript" src="~/admin/uploader/js/webuploader.min.js"></script>*@
    <script src="~/admin/uploader/js/ajaxFileUpload.js"></script>
@*<script type="text/javascript" src="~/admin/uploader/js/upload.js"></script>*@
    <script>
    $("#Upload").click(function () {
        $("#file").click();
        $("#file").change(function () {
            var emptyData = $.parseJSON("[{}]");
            $('#tbMaterialList').datagrid('loadData', emptyData); //置空数据
            $("#submitBtn").hide();
            $("#operateMsg").html("");
            $.ajaxFileUpload({
                url: 'SelectImportFile', //你处理上传文件的服务端
                secureuri: false, //与页面处理代码中file相对应的ID值
                fileElementId: 'file',
                dataType: 'json', //返回数据类型:text，xml，json，html,scritp,jsonp五种
                success: function (data) {
                    
                    if (data.allDataIsOk == true)
                    {
                        $("#submitBtn").show();
                        
                    }
                    else
                    {
                        $("#submitBtn").hide();
                        
                    }
                    var msg = data.allDataMsg;
                    $("#operateMsg").html(msg);
                    $.messager.alert('操作结果', msg, 'info');
                    //fLoadTable();
                    //var usedata = $.parseJSON(data.rows);
                    $('#tbMaterialList').datagrid('loadData', data.rows); //将数据绑定到datagrid 
                   
                }
            })
        });
    });

    $("#submitBtn").click(function () {
        var emptyData = $.parseJSON("[{}]");
        $('#tbMaterialList').datagrid('loadData', emptyData); //置空数据
        $("#operateMsg").html("");
        $.ajaxFileUpload({
            url: 'DoImport', //你处理上传文件的服务端
            secureuri: false, //与页面处理代码中file相对应的ID值
            fileElementId: 'file',
            dataType: 'json', //返回数据类型:text，xml，json，html,scritp,jsonp五种
            success: function (data) {
                var msg = data.allDataMsg;
                $("#operateMsg").html(msg);
                $.messager.alert('操作结果', msg, 'info');
                $('#tbMaterialList').datagrid('loadData', data.rows); //将数据绑定到datagrid 
             
            }
        })

    });
       


    function alterss(data) {
        new pop({
            type: "import",
            boxStyle: "width:670px",
            title: "订单批量导入",
            content: data,
            btn: ["确认", "查看审核中的商品", "查看我供应的商品"],
            setBtnAttr: ["href='javascript:'", "href='Index'", "href='CanSupplierGoods'"]
        })
    }
    </script>




    @section Script{
        <script type="text/javascript">
            $(document).ready(function () {
                fLoadTable();
                $("#submitBtn").hide();
            })
            function fLoadTable() {
                $('#tbMaterialList').datagrid({
                    fit : true,
                    fitColumns : true,
                    columns: [[
                        , { field: 'MaterialName', title: '物料名称', width:'25%' }
                        , { field: 'CatagoryName', title: '分类', width: '25%', align: 'left' }
                        , { field: 'SingleWeight', title: '净重', width: '25%', align: 'center' }
                         
                    ]],
                    toolbar: '#tb'
                });
            };
        </script>

    }


    </body>

